var current;
var slideshow;

$(document).ready(function(){
	current = 0;
	$('.image-table img').each(function(){
		setImage($(this));
	});
	
	startSlideShow();

	$('.play').click(function () {
		rotate(120)
		startSlideShow();
	});	
	
	$('.pause').click(function () {
		stopSlideShow();
	});	
	
	$('.next').click(function () {
		stopSlideShow();
		rotate(120);
	});	
	
	$('.prev').click(function () {
		stopSlideShow();
		current = current - 10;
		if (current < 0){
			current = $('.image-holder').length + current;
		}
		rotate(-120);
	});	
});		

function startSlideShow(){
	slideshow = setInterval(function(){ 
    	rotate(120);
	}, 10000);
	$('.play').hide();
	$('.pause').show();
};

function stopSlideShow(){
	clearInterval(slideshow);
	$('.pause').hide();
	$('.play').show();
};

function setImage(image){
	image.removeAttr('style');
	image.attr('src', $('.image-holder').eq(current).attr('src'));
	current++;
	if(current >= $('.image-holder').length){
		current = 0;
	}
	var top_margin = (320 - image.height()) / 2;
	image.css('margin-top', top_margin);
}

function rotate(degree){
	$('.image-table img').each(function(){
		$(this).stop(true, true);
	})
	$('.image-table img').each(function(i){
		var rotation = parseInt($(this).css('letter-spacing')) + degree;
		$(this).delay(400 * i).animate({
			'letter-spacing': rotation
		}, 
		{
			step: function(now, fx){
				$(this).css({
					'-webkit-transform':'rotate('+now+'deg)',
					'-moz-transform':'rotate('+now+'deg)',
					'-ms-transform':'rotate('+now+'deg)',
					'-o-transform':'rotate('+now+'deg)',
					'transform':'rotate('+now+'deg)'
				}); 
			},
			duration: 1300,
			complete: function(){
			setImage($(this));
			$(this).hide();
			$(this).fadeIn(500);		
			}  								
		}, 'linear'
	);
});
};